<template>
	<view class="sub-menu">
		<view class="list">
			<view class="item" v-for="item in menuList" :key="item.name" @click.stop="handleClick(item)">{{ item.name }}</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				menuList: [{
						name: this.$t('index.subMenu.0'),
						url: '',
						wechatUrl: '/pages/index/index'
					},
					{
						name: this.$t('index.subMenu.2'),
						url: 'jianjieForum2025',
						wechatUrl: '/pages/jianjieForum/index'
					},
					{
						name: this.$t('index.subMenu.3'),
						url: 'activityGreen'
					},
					{
						name: this.$t('index.subMenu.4'),
						url: 'technology'
					},
					{
						name: this.$t('helperSec3'),
						url: 'stage'
					},
					{
						name: 'AI科创赛',
						url: 'activitySubmit'
					},
					{
						name: '创投Meetup',
						url: 'meetUp'
					},
					{
						name: '科技人才招聘会',
						url: 'activityExchange'
					}
				],
			};
		},
		methods: {
			handleClick(item) {
				this.$store.commit('setShowMenu', false)
				if (item.wechatUrl) {
					uni.navigateTo({
						url: item.wechatUrl
					});
					return
				}
				this.linkWeb(item.url)
			}
		},
	};
</script>
<style lang="scss" scoped>
	.sub-menu {
		position: fixed;
		left: 16rpx;
		bottom: calc(30px + 130rpx);
		padding: 4rpx 24rpx;
		background: #131840;
		z-index: 100;

		&::after {
			content: '';
			position: absolute;
			bottom: -10rpx;
			left: 50%;
			transform: translateX(-50%);
			width: 0;
			height: 0;
			border-left: 10rpx solid transparent;
			border-right: 10rpx solid transparent;
			border-top: 10rpx solid #131840;
		}
	}

	.item {
		padding: 26rpx 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.12);
		font-family: AlibabaPuHuiTi_3_55_Regular;
		font-size: 30rpx;
		color: #ffffff;
		line-height: 30rpx;

		&:last-child {
			border-bottom: none;
		}
	}
</style>